﻿var uri = '/KPT/SKpt.ashx';
var uid = '1234567890123456';
var did = ''; // 当前KPTID。

$(document).ready(function () {
    uid = $('#HfUser').val();
    showByTodo();
});

function showByType() {
    return false;
}
function showByTodo() {
    var id = 'all';
    $('#dvAll').empty().append(genTodoInput(id, 0, 0));
    listTodoItems(id);
    return false;
}
function showByDate() {
    return false;
}
function showByDone() {
    var id = 'all';
    $('#dvAll').empty().append(genDoneInput(id));
    listDoneItems(id);
    return false;
}

function genTodoInput(id, m, l) {
    m = m ? 1 : 0;
    l = l ? 1 : 0;

    var obj = '<div id="' + id + '_t" class="gtd_input">';
    obj += '<input type="text" id="' + id + '_sub" name="' + id + '" major="' + m + '" label="' + l + '" class="gtd_tx" onkeydown="return appendKpt(event)" placeholder="点击输入，回车继续" x-webkit-speech="" />';
    //obj += '<input type="button" id="' + id + 'gtdb" class="gtd_bt" onclick="return appendGtd()" />';
    obj += '</div>';

    obj += '<div id="' + id + '_d"></div>';

    return obj;
}

function genTodoItems(kpt) {
    var obj = '<div id="dv' + kpt.Id + '" class="gtd_item">';
    obj += '<table width="100%" cellpadding="3" cellspacing="0">';
    obj += '<tr id="c' + kpt.Id + '">';
    obj += '<td id="m' + kpt.Id + '" class="gtd_' + (kpt.Major ? 'm' : 'd') + '" rowspan="2" value="' + (kpt.Major ? 1 : 0) + '" onclick="return changeMajor(this);"></td>';
    obj += '<td id="l' + kpt.Id + '" class="gtd_' + (kpt.Label ? 'l' : 'd') + '" rowspan="2" value="' + (kpt.Label ? 1 : 0) + '" onclick="return changeLabel(this);"></td>';
    obj += '<td class="gtd_s" align="center" valign="middle" rowspan="2">';
    obj += '<input type="checkbox" id="' + kpt.Id + '" value="' + kpt.Status + '" onclick="return changeStatus(this);" />';
    //obj += '<div id="' + gtd.Id + '" values="' + gtd.Status + '" class="gtd_cu" onclick="return changeStatus(this);"/>';
    obj += '</td>';
    obj += '<td id="' + kpt.Id + '_ds" class="gtd_c" align="left" colspan="2">' + kpt.Subject + '</td>';
    obj += '</tr>';
    obj += '<tr id="o' + kpt.Id + '">';
    obj += '<td class="gtd_t" align="left">';
    obj += kpt.CreateTime;
    obj += '</td>';
    obj += '<td class="gtd_o" align="right">';
    obj += '<input type="button" title="提醒" class="opt_def opt_todo" onclick="return editDate(\'' + kpt.Id + '\');" /> ';
    obj += '<input type="button" title="编辑" class="opt_def opt_edit" onclick="return editGtd(\'' + kpt.Id + '\');" /> ';
    obj += '<input type="button" title="进度" class="opt_def opt_list" onclick="return editKpt(\'' + kpt.Id + '\');" /> ';
    obj += '<input type="button" title="备注" class="opt_def opt_tags" onclick="return editMemo(\'' + kpt.Id + '\');" /> ';
    //obj += '<input type="button" title="标签" class="opt_def opt_tags" onclick="return editTag(\'' + kpt.Id + '\');" /> ';
    obj += '</td>';
    obj += '</tr>';
    obj += '</table>';
    obj += '</div>';

    return obj;
}

function listTodoItems(id) {
    $.ajax({
        type: "POST",
        url: uri,
        data: { u: uid, o: "l" },
        dataType: 'json',
        success: function (dat) {
            var i = 0;
            var n = dat.length;
            var obj = $('#' + id + '_d');
            for (; i < n; i += 1) {
                obj.append(genTodoItems(dat[i]));
            }
        },
        error: function () {
            alert('error');
        }
    });
}

function genDoneInput(id) {
    return '<table id="' + id + '_d" width="100%" border="0" cellpadding="3" cellspacing="0"></table>';
}
function genDoneItems(kpt) {
    var obj = '<tr>';
    obj += '<td class="done_line" align="center" valign="top">';
    obj += '<input type="button" class="done_node" />';
    obj += '</td>';
    obj += '<td class="done_item">';
    obj += '<label class="done_date">' + kpt.DisplayTime + '</label>';
    obj += '<div class="done_ctx">' + kpt.Subject + '<br />';
    if (kpt.Content) {
        obj += kpt.Content;
    }
    obj += '</div>';
    obj += '</td>';
    obj += '</tr>';

    return obj;
}

function listDoneItems(id) {
    $.ajax({
        type: "POST",
        url: uri,
        data: { u: uid, o: "l", du: 1 },
        dataType: 'json',
        success: function (dat) {
            var i = 0;
            var n = dat.length;
            var obj = $('#' + id + '_d');
            for (; i < n; i += 1) {
                obj.append(genDoneItems(dat[i]));
            }
        },
        error: function () {
            alert('error');
        }
    });
}

function appendKpt(e) {
    var evt = e || event;
    if (evt.keyCode != 13) {
        return evt;
    }

    var tx = evt.srcElement;
    if (!tx) {
        return false;
    }
    var val = tx.value;
    if (!val) {
        return;
    }
    var m = tx.getAttribute("major");
    var l = tx.getAttribute("label");

    $.ajax({
        type: "POST",
        url: uri,
        data: { u: uid, o: "c", ds: val, dm: m, dl: l },
        dataType: 'json',
        success: function (dat) {
            //var gtd = eval(dat);
            //alert(dat);
            tx.value = '';
            $('#' + tx.name + '_d').append(genTodoItems(dat));
            tx.focus();
        },
        error: function () {
            alert('error');
        }
    });
    return false;
}
function changeMajor(obj) {
    var val = obj.getAttribute("value");
    if (val == "1") {
        val = "0";
        obj.className = "gtd_d";
        obj.setAttribute("value", val);
    }
    else {
        val = "1";
        obj.className = "gtd_m";
        obj.setAttribute("value", val);
    }

    $.ajax({
        type: "POST",
        url: uri,
        data: { u: uid, o: "h", di: obj.id.substring(1), dm: val },
        dataType: 'json'
    });
}
function changeLabel(obj) {
    var val = obj.getAttribute("value");
    if (val == "1") {
        val = "0";
        obj.className = "gtd_d";
        obj.setAttribute("value", val);
    }
    else {
        val = "1";
        obj.className = "gtd_l";
        obj.setAttribute("value", val);
    }
    $.ajax({
        type: "POST",
        url: uri,
        data: { u: uid, o: "h", di: obj.id.substring(1), dl: val },
        dataType: 'json'
    });
}
function changeStatus(obj) {
    var st = obj.value;
    if (st != 0) {
        showEcho('OK');
        return;
    }

    $.ajax({
        type: "POST",
        url: uri,
        data: { u: uid, o: "h", di: obj.id, du: 1 },
        dataType: 'json',
        success: function (dat) {
            $('#dv' + obj.id).hide();
            showEcho('OK');
        },
        error: function () {
            alert('error');
        }
    });
}

function editDate(id) {
    $("#dgDate").dialog({
        resizable: false,
        height: 480,
        modal: true,
        buttons: {
            "保存": function () {
                $(this).dialog("close");
            },
            "取消": function () {
                $(this).dialog("close");
            }
        }
    });
    return false;
}
function editGtd(id) {
    $("#dgGtd").dialog({
        resizable: false,
        height: 480,
        modal: true,
        buttons: {
            "保存": function () {
                updateGtd(id);
            },
            "取消": function () {
                $(this).dialog("close");
            }
        }
    });
    $.ajax({
        type: "POST",
        url: uri,
        data: { u: uid, o: "i", di: id },
        dataType: 'json',
        success: function (dat) {
            $('#tads').val(dat.Subject);
            $('#ckdm').attr("checked", dat.Major);
            $('#ckdl').attr("checked", dat.Label);
            $('#tadc').val(dat.Content);
        },
        error: function () {
            alert('error');
        }
    });
    return false;
}
function editKpt(id) {
    $("#dgKpt").dialog({
        resizable: false,
        height: 480,
        modal: true,
        buttons: {
            "保存": function () {
                updateKpt(id);
            },
            "取消": function () {
                $(this).dialog("close");
            }
        }
    });
    $("#dpKpt").accordion();
    $.ajax({
        type: "POST",
        url: uri,
        data: { u: uid, o: "i", di: id },
        dataType: 'json',
        success: function (dat) {
            $('#tadk').val(dat.K);
            $('#tadp').val(dat.P);
            $('#tadt').val(dat.T);
        },
        error: function () {
            alert('error');
        }
    });
    return false;
}
function editTag(id) {
    $("#dgGtd").dialog({
        resizable: false,
        height: 480,
        modal: true,
        buttons: {
            "保存": function () {
                updateKpt(id);
            },
            "取消": function () {
                $(this).dialog("close");
            }
        }
    });
    return false;
}
function editMemo(id) {
    $("#dgMemo").dialog({
        resizable: false,
        height: 480,
        modal: true,
        buttons: {
            "保存": function () {
                updateMemo(id);
            },
            "取消": function () {
                $(this).dialog("close");
            }
        }
    });
    return false;
}
function updateGtd(id) {
    var tds = $('#tads').val();
    if (!tds) {
        alert('请输入标题！');
    }

    var cm = $('#ckdm').is(':checked');
    var cl = $('#ckdl').is(':checked');
    $.ajax({
        type: "POST",
        url: uri,
        data: { u: uid, o: "u", di: id, ds: tds, dc: $('#tadc').val(), dm: cm ? 1 : 0, dl: cl ? 1 : 0 },
        dataType: 'json',
        success: function (dat) {
            $("#dgGtd").dialog("close");
            $('#' + id + '_ds').text(tds);
            $('#m' + id).css(cm ? "gtd_m" : "gtd_d");
            $('#l' + id).css(cm ? "gtd_l" : "gtd_d");
        },
        error: function () {
            alert('error');
        }
    });
}
function updateKpt(id) {
    $.ajax({
        type: "POST",
        url: uri,
        data: { u: uid, o: "k", di: id, dk: $('#tadk').val(), dp: $('#tadp').val(), dt: $('#tadt').val() },
        dataType: 'json',
        success: function (dat) {
            $("#dgKpt").dialog("close");
        },
        error: function () {
            alert('error');
        }
    });
}
function updateMemo(id) {
}

var dvMsg;
var opMsg;
var itMsg;
function showEcho(msg) {
    $('#llMsg').text(msg);
    dvMsg = $('#dvMsg');
    opMsg = 1.0;
    if (itMsg == null) {
        itMsg = setInterval(showEcho1, 100);
    }
}
function showEcho1() {
    //dvMsg.style.filter = 'alpha(opacity=' + opMsg + ') gray';
    dvMsg.css({ 'opacity': opMsg });
    opMsg -= 0.1;
    if (opMsg < 0.1) {
        clearInterval(itMsg);
        itMsg = null;
    }
}

(function ($) {
    $.fn.viewload = function (options) {
        var settings = {
            _before: 0,
            _moreimg: 0,
            _event: "scroll",
            _show: "fadeIn",
            _object: window,
            _oimg: "img/blank.gif"
        };

        if (options) { $.extend(settings, options); }
        var elements = this;
        if (settings._event == "scroll") {
            $(settings._object).bind("scroll", function (event) {
                var counter = 0;
                elements.each(function () {
                    if (!$.s_y(this, settings) && !$.s_x(this, settings)) {
                        $(this).trigger("appear");
                    } else {
                        if (counter++ > settings._moreimg) {
                            return false;
                        }
                    }
                });
                var temp = $.grep(elements, function (element) {
                    return !element.loaded;
                });
                elements = $(temp);
            })
        }
        return this.each(function () {
            var self = this;
            $(self).attr("original", $(self).attr("src"));
            if (settings._event != "scroll" || $.s_y(self, settings) || $.s_x(self, settings)) {
                if (settings._oimg) {
                    $(self).attr("src", settings._oimg);
                } else {
                    $(self).removeAttr("src");
                }
                self.loaded = false;
            } else {
                self.loaded = true;
            }
            $(self).one("appear", function () {
                if (!this.loaded) {
                    $("<img />").bind("load", function () {
                        $(self).hide().attr("src", $(self).attr("original"))[settings._show](settings.effectspeed);
                        self.loaded = true;
                    }).attr("src", $(self).attr("original"));
                }
            });
            if (settings._event != "scroll") {
                $(self).bind(settings._event, function (event) {
                    if (!self.loaded) {
                        $(self).trigger("appear");
                    }
                })
            }
        })
    };
    $.s_y = function (element, settings) {
        if (settings._object === undefined || settings._object === window) {
            var fold = $(window).height() + $(window).scrollTop();
        } else {
            var fold = $(settings._object).offset().top + $(settings._object).height();
        }
        return fold <= $(element).offset().top - settings._before;
    };
    $.s_x = function (element, settings) {
        if (settings._object === undefined || settings._object === window) {
            var fold = $(window).width() + $(window).scrollLeft();
        } else {
            var fold = $(settings._object).offset().left + $(settings._object).width();
        }
        return fold <= $(element).offset().left - settings._before;
    };
    $.extend($.expr[':'], {
        "below-the-fold": "$.s_y(a,{_before:0,_object:window})", "above-the-fold": "!$.s_y(a,{_before:0,_object:window})",
        "right-of-fold": "$.s_x(a,{_before:0,_object:window})", "left-of-fold": "!$.s_x(a,{_before:0,_object:window})"
    })
})(jQuery);
$(function(){
    $("img").viewload({
        _before:0,//加載圖片時的提前量,0表示即時加載,如设置为200,表示滚动条在离目标位置还有200像素时就开始加载图片,可以做到不让用户察觉.
        //_moreimg:0,//該插件默认在找到第一张不在可见区的图片时则不再继续加载,但当HTML容器混乱的时候可能出现可见区域内图片并没正常加载的情况,該參數意在加载N张可见区域外的图片,以避免出现这个问题
        //_event:"scroll",//事件触发时才加载,click(点击),mouseover(鼠标經過),scroll(滾動條滾動),這裡的值可以查閱jquery的事件
        //_show:"fadeIn",//使用何种效果载入,show(直接显示),fadeIn(淡入),slideDown(下拉),這裡的值可以查閱jquery的動畫效果
        _object:window,//值为容器對象.該插件默认在拉动浏览器滚动条时生效,这个参数可以让你在拉动某容器的滚动条时依次加载其中的图片,例如:$("div #box")
        //_oimg:"img/blank.gif"//提前占位用的图片(一個长度和宽度均为1像素的图片),值为某一图片路径.此图片用来占据将要加载的图片的位置,当图片加载时,该占位图则会隐藏
    });
});
